メインコンテンツへスキップ

#GitHub Actions

RSSフィード
おすすめ
公開日:

GitHub Actionsでサードパーティのアクションを利用する際、バージョンをタグで指定しているケースをよく見かけるが、セキュリティの観点からは推奨されない。GitHub公式ドキュメントでは、アクションを不変なリリースとして利用する唯一の方法として、SHA Pining、つまりコミットSHAにピン留めすることを推奨している。

All Posts

RenovateでGitHub ActionsのSHA Pinningを手軽に行う

GitHub Actionsでサードパーティのアクションを利用する際、バージョンをタグで指定しているケースをよく見かけるが、セキュリティの観点からは推奨されない。GitHub公式ドキュメントでは、アクションを不変なリリースとして利用する唯一の方法として、SHA Pining、つまりコミットSHAにピン留めすることを推奨している。

VitestのカバレッジレポートをGithub Actionsで添付する実装例

davelosert/vitest-coverage-report-actionを利用することで簡単にVitestのカバレッジレポートを添付することが出来る。

npmパッケージ公開のOIDC Trusted publishingへの移行

OIDC Trusted publishingを用いたnpmパッケージの公開方法およびTrusted publishingのメリットと制約について。

GitHub Actionsを利用してリリースノートの生成を自動化する

GitHub CLIを利用してリリースノートを生成する方法とGitHub Actionsでの使用例の紹介

AIなどの特定ユーザーの作成したPRに要求するApproval数を増やす

Botなどが作成したPull Requestに対して、GitHub Actionsを利用して通常より多くのApproveを要求する方法

PRが閉じられたら自動的にNetlifyのDeployを削除する

NetlifyにはDeployを自動的に削除する機能があるが、よりコントロールしたい場合にはNetlify APIが利用できる。この記事では、Github Actionsで自動的にNetlifyのDeployを削除する方法について紹介する。

QRコードを簡単に生成する

QRコードを生成するライブラリは多く存在する。また、一時的なもので良ければURLで生成できるサービスもある。

Q. gh pr createでレビュワーをチームに変更したら、Github Actions上で動作しなくなった

gh pr createでレビュワーをチームにする場合、追加で`read:org`の権限が必要になるため、デフォルトのsecrets.GITHUB_TOKENでは動作しなくなる。`repo`と`read:org`の権限を持ったPersonal Access Tokenを使うことで解決できる。

How to make Github Actions matrix items conditional

Github Actionsのmatrixのアイテムを条件によって切り替える方法について

Githubの検索に使える記述について

Githubの検索については公式ドキュメントが十分にまとめられている。しかし、少し辿りにくいようなので、人に共有しやすいように公式ドキュメントのリンクや一部の記述についてまとめた。

Github ActionsにおけるNode.jsパッケージのキャッシュについて

Github ActionsにおけるNode.jsパッケージのキャッシュについて、actions/setup-nodeの推奨する方法やnode_modulesをキャッシュする方法、その周辺について紹介する。

actions/setup-nodeでnode-version-fileの利用を勧める不純な理由

actions/setup-nodeではnode-version-fileを利用することで、利用されるNode.jsのバージョンをpackage.jsonなどに合わせることが出来る。これだけで便利だが、他にもお勧めできる不純な理由がある。

actions/setup-nodeのcacheはnode_modulesをキャッシュしない

actions/setup-nodeのcacheが期待通りに動作しないことは認識していたが、改めて調べたらそもそもnode_modulesをキャッシュしないことが分かった。

Github Workflowsで環境に応じて異なるSecretsやVariablesを使う

Github WorkflowsでEnvironment SecretsやEnvironment Variablesを使って環境に応じて異なるSecretsやVariablesを使う方法を紹介する。

Q. pull_requestトリガーのworkflowがなぜか実行されていない

Github Actionsのpull_requestトリガーのworkflowがなぜか実行されていないという相談を受けたので、その原因と解決策についてまとめた。

prCreationがnot-pendingになっているGithubリポジトリでRenovateが動作しなくなっていた

RenovateがPRを作成するタイミングをnot-pendingにしている場合、Githubのブランチプロテクションでpull_requestトリガーのGithub Workflowを必須にしているとPRが作成されなくなることについて説明する。l

Q. Github Workflowsが落ちたらIssueを作らせたい

Github Workflowsが落ちたらIssueを作らせる方法について調査した結果をまとめた。

Github Actionsを利用してReviewer全員のApprovedを必須にする

GithubでReviewer全員のApprovedを必須にする方法を紹介するが、おすすめしない。

News bits

GitHub Actions: ホストランナーの価格値下げ

GitHub-hosted runnersの利用料金が値下げされた。 最大で39%の価格引き下げとなり、Standard hosted runnerのパブリックリポジトリでの利用は引き続き無料。 これは2025年12月16日にアナウンスされていた内容が適用されたもので、CI/CDコストの削減に寄与する。

出展:Reduced pricing for GitHub-hosted runners usage

GitHub Actionsのキャッシュサイズが10GBを超えられるように

GitHub Actionsのキャッシュストレージが拡張され、リポジトリあたり10GBを超えるキャッシュを保存できるようになった。10GBまでは無料で提供され、それ以上は従量課金モデルで利用可能。Pro、Team、Enterpriseアカウントが必要。

キャッシュ管理ポリシーとして、キャッシュサイズの上限(GB)と保持期間(日数)を設定できる。デフォルトは10GBのサイズ制限と7日間の保持期間。上限を超えた場合、最も使用頻度の低いキャッシュエントリが自動的に削除される。

Enterprise、Organization、Repository管理者がActions設定またはPoliciesで管理可能。ポリシーは階層的に適用される(Enterpriseの設定がOrganizationに継承される)。

出展:GitHub Actions cache size can now exceed 10 GB per repository

GitHub Actionsの`pull_request_target`とenvironment branch protection rulesの変更

GitHub Actionsのpull_request_targetとenvironment branch protection rulesの評価方法が変更される。12月8日から適用。ユーザー制御ブランチでの予期しないワークフローコード実行や環境シークレットへのアクセスを防ぐため。

pull_request_targetイベントは常にデフォルトブランチをワークフローソースと参照として使用するようになる。ワークフローファイルとcheckoutコミットは常にリポジトリのデフォルトブランチから取得され、pull requestのベースブランチに関係なく実行される。これにより、リポジトリ内の他のブランチにある古い、脆弱な可能性のあるワークフローが実行されることを防ぐ。

GITHUB_REFはデフォルトブランチに解決され、GITHUB_SHAはそのブランチの最新コミットを指す。これにより、信頼できない名前やブランチが評価に影響を与える既知の脆弱性クラスを閉じる。

以前は、pull requestのベースブランチとして設定された親リポジトリ内の任意のブランチが実行されるワークフローのソースとして使用され、古いワークフローが実行される可能性があった。この変更により、これらのイベントで実行されるワークフローソースとしてリポジトリのデフォルトブランチのみが使用される。

環境ブランチ保護ルールは実行参照に対して評価される。pull requestワークフロー中に環境シークレットへの意図しないアクセスを防ぐため、環境ブランチ保護ルールはpull request head(HEAD_REF)ではなく実行参照(GITHUB_REF)に対して評価される。

  • pull_requestpull_request_reviewpull_request_review_commentでは、環境ルールはrefs/pull/number/mergeに対して評価される
  • pull_request_targetでは、環境ルールはデフォルトブランチに対して評価される

推奨事項:

  • pull_request_targetの使用を必要最小限にし、ユーザー制御入力やコードが信頼できないコードを実行する方法で実行に影響を与えないようにする
  • ワークフローが高度な権限やシークレットへのアクセスを必要としない場合、pull_requestを使用する
  • これらのワークフローに付与される権限を制限し、デフォルトトークン権限を読み取り専用に設定するか、ワークフローで最小権限設定を適用する
  • CodeQLを使用してアクションワークフローの脆弱性をスキャンする

環境ブランチ保護ルールを使用し、pull requestイベントでトリガーされるワークフローの場合:

  • pull_requestの環境ブランチフィルターを更新し、refs/pull/number/mergeのようなパターンを追加
  • pull_request_targetでは、リポジトリのデフォルトブランチを追加

出展:Actions pull_request_target and environment branch protections changes

GitHub Actionsの新機能、再利用可能なワークフローの拡張

GitHub Actionsに新機能が追加された。

再利用可能なワークフローの制限が増加。最大10ネストの再利用可能なワークフローと、1つのワークフロー実行から最大50ワークフローの呼び出しが可能。以前の制限はそれぞれ4と20。自動化のスケーリングとコラボレーションの効率化が容易になる。

M2 macOSランナーが一般提供開始。macos-latest-xlargemacos-15-xlargemacos-14-xlargemacos-13-xlargeラベルを使用してM2マシンでワークフローを実行可能。パフォーマンスとGPUアクセラレーションが向上。

GitHub Copilot coding agentがGitHub Actionsを有効化しなくても使用可能。組織でGitHub Actionsを有効化しなくても、GitHub Copilot coding agentを使用できる。ワークフロー自動化とAI支援コーディングアシスタンスの設定の柔軟性が向上。

出展:New releases for GitHub Actions – November 2025

GitHub Actionsに1 vCPU Linux runnerが追加

GitHub Actionsに1 vCPU Linux runnerがパブリックプレビューで利用可能になった。軽量な操作を実行する際のコスト削減を目的としたランナー。自動化タスク、issue操作、短時間のジョブに最適化されている。

このランナーは1 vCPUと5GB RAMを搭載。専用VMではなくコンテナ内で実行されるため、コスト効率が高い。ハイパーバイザーレベル2の分離を提供し、ジョブ完了時に自動的に削除される。実行時間は15分に制限されており、それを超えるとジョブは終了して失敗する。ubuntu-slimランナータイプを指定して使用する。用途例として、issueの自動ラベリング、基本的な言語コンパイル(webpackビルドなど)、リンティングやフォーマットなどが挙げられる。

出展:1 vCPU Linux runner now available in GitHub Actions in public preview

GitHub Actions、YAML anchorsとJob check run ID

GitHub ActionsでYAML anchorsのサポート、non-public .githubリポジトリからのworkflow templates利用、job check run IDの追加が行われた。

  • YAML anchors: workflow設定の再利用が可能、YAML仕様への準拠向上。
  • Non-public workflow templates: internal/private .githubリポジトリからworkflow templatesを利用可能。
    • GitHub Issuesなどは引き続き非公開リポジトリを参照出来ないため注意。
    • .githubが非公開の場合は、利用側も非公開である必要がある。
  • Job check run ID: job.check_run_idで現在実行中のjobを識別可能、レポートや通知、artifact管理が容易。

次はYAML anchorsの利用例。

yml
jobs:
  job1:
    env: &env_vars # Define the anchor on first use
      NODE_ENV: production
      DATABASE_URL: ${{ secrets.DATABASE_URL }}
  job2:
    env: *env_vars # Reuse the environment variables
yml
jobs:
  test: &base_job # Define the anchor on first use
    runs-on: ubuntu-latest
    env:
      NODE_VERSION: '18'
    steps:
      - uses: actions/checkout@v5

  alt-test: *base_job # Reuse the entire job configuration
WARNING

GitHub ActionsのYAML Anchors採用については否定的な意見も見られる。

参考:Dear GitHub: no YAML anchors, please

出展:Actions: YAML anchors and non-public workflow templates

Gemini CLI GitHub Actionsがベータ版としてリリース

リポジトリ向けのAIコーディングアシスタント「Gemini CLI GitHub Actions」がベータ版としてリリースされた。このツールは、GitHubリポジトリ上でコーディングの定型タスクを自動化するエージェント、およびオンデマンドでタスクを委任できるコラボレーターとして機能する。利用は無料。

主な利用例は以下の通り。

  • Intelligent issue triage: 新しいissueを分析し、ラベル付けや優先順位付けを自動化する。
  • Accelerated pull request reviews: pull requestの品質、スタイル、正確性をレビューし、フィードバックを即座に提供する。
  • On-demand collaboration: issueやpull requestで「@gemini-cli」とメンションすることで、テスト作成やバグ修正などのタスクを委任できる。

セキュリティ機能として、Google CloudのWorkload Identity Federation (WIF) を利用したクレデンシャルレス認証や、実行可能なコマンドを制限する許可リスト機能を搭載。また、OpenTelemetryとの統合により、すべてのアクションをリアルタイムで監視可能。

本機能は、Google AI Studioの無料枠内で利用できるほか、Vertex AI、Gemini Code AssistのStandardおよびEnterpriseティアもサポートしている。

出展:Meet your new AI coding teammate: Gemini CLI GitHub Actions

リポジトリ:google-github-actions/run-gemini-cli

Claude Code、自動セキュリティレビュー機能を追加

Claude Codeに、コードのセキュリティレビューを自動化する機能が追加された。GitHub Actionsとの連携や、新しい/security-reviewコマンドを使用して、開発者はコードの脆弱性を特定し、修正を依頼できる。これにより、脆弱性がproduction環境に到達する前に発見し、対処することが可能になる。

  • /security-review コマンド: ターミナルからアドホックにセキュリティ分析を実行。SQL injectionやcross-site scripting (XSS)などの一般的な脆弱性パターンを検索し、発見された問題の詳細な説明を提供する。
  • GitHub Actions 連携: 新規pull requestが開かれると自動的にトリガーされ、コードの変更点をレビュー。カスタマイズ可能なルールを適用し、懸念事項を修正案とともにpull requestへインラインでコメントする。

この機能はAnthropic社内でも利用されており、DNS rebindingによるリモートコード実行の脆弱性や、SSRF (Server-Side Request Forgery)攻撃の脆弱性をリリース前に発見、修正した実績がある。両機能はすべてのClaude Codeユーザーが利用可能。

出展:Automate security reviews with Claude Code - Anthropic

GitHub Actions新REST APIとwindows-latest移行告知

GitHub Actionsで設定管理用の新しいREST APIが公開され、フォークPRワークフローの承認設定、プライベートリポジトリでのフォークPRワークフロー許可、セルフホストランナー作成権限、アーティファクト・ログ保持期間の設定をプログラム的に管理可能になった。Enterprise、組織、リポジトリレベルで利用でき、手動レビューの必要性を大幅削減。またwindows-latestラベルが9月2日から9月30日にかけてWindows Server 2022から2025へ段階的に移行予定で、新イメージではツール構成が異なる可能性があるため事前確認が推奨される。

出展:GitHub Actions: New APIs and windows-latest migration notice

GitHub Dependabotアラートのバッチ更新機能が一般提供開始

GitHubのDependabotアラートでバッチ更新機能が一般提供開始。組織全体で複数のDependabotアラートを一度に却下または再開可能になり、セキュリティチームと開発チームのアラート管理が効率化。従来は個別アラート管理のみだったが、チェックボックスで複数選択してバルク更新できるようになった。セキュリティマネージャー役割のメンバーと「Dependabotアラートを表示」権限を持つユーザーが利用可能で、手動作業の削減とワークフローの合理化を実現。

出展:Managing Dependabot alerts with batched updates is now generally available

GitHub Actions、M2 Pro 搭載 macOS XLarge runner の提供開始

GitHub Actions で M2 Pro 搭載の macOS XLarge hosted runner がパブリックプレビューで利用可能になった。5vCPU M2 Pro マシンで、5 コア CPU、8 コア GPU、14GB RAM、14GB ストレージを搭載。

M1 比較で最大 15%のビルド時間短縮を実現。GPU hardware acceleration がデフォルトで有効化され、ワークロードが CPU から GPU に転送される。6 コア M1 macOS larger runner は利用不可になった。

使用方法はruns-on:キーをmacos-latest-xlargemacos-15-xlargemacos-14-xlargemacos-13-xlargeのいずれかに設定。料金は従来の XLarge runner と同じ$0.16/分。サインアップ不要で全開発者、チーム、企業で即座に利用可能。

出展:GitHub Actions now offers M2 Pro-powered hosted runners in public preview

GitHub Actions、macos-latest が 8 月 4 日から macOS 15 に移行開始

GitHub Actions で macOS hosted runner に関する変更が発表された。

主要な変更内容:

  • macos-latestが 8 月 4 日から macOS 15 に移行開始、9 月 1 日完了
  • macos-latest-largemacos-latest-xlargeも対象
  • Xcode サポートポリシー変更:8 月 11 日から最大 3 つの runtimes のみ保持
  • macOS 13 は 9 月 1 日から廃止開始、11 月 14 日完全廃止

移行期間中はワークフローが段階的に新しいイメージに切り替わる。移行後は macOS 14 での実行は不可。macOS 13 使用ワークフローはmacos-14またはmacos-15への更新が推奨される。

出展:Upcoming changes to macOS hosted runners: macos-latest migration and Xcode support policy updates

GitHub Actions の fine-grain 権限設定がカスタムリポジトリロールに提供

GitHub Actions の fine-grain 権限設定がカスタムリポジトリロールで正式に利用可能になった。

昨年 GitHub は CI/CD Admin role を導入し、組織内の全リポジトリに対する包括的な CI/CD 権限を提供していた。今回のリリースにより、組織管理者は特定の GitHub Actions 権限を持つカスタムリポジトリロールを作成できるようになる。

設定可能な権限には、Actions 全般設定、ランナー管理、シークレット管理、変数管理、環境管理(環境のシークレットと変数を含む)が含まれる。これにより、組織管理者は他の組織オーナー権限を付与することなく、個人やチームに CI/CD 自動化管理の責任を委任できる。

カスタムリポジトリロールは 2022 年 6 月に正式提供が開始されており、35 の fine-grained permissions を通じて、ディスカッション、Issue、プルリクエスト、リポジトリ、セキュリティアラートをカバーしている。作成されたロールは、リポジトリ管理者がリポジトリ内の任意の個人またはチームに割り当てることができる。

出展:GitHub Actions fine-grain permissions are now generally available for custom repository roles

参考:About custom repository roles - GitHub Enterprise Cloud Docs

ECMAScript 2025 が正式承認

Ecma International の第 129 回総会で ECMAScript 2025 言語仕様が正式に承認され、標準となった。編集者は Shu-yu Guo、Michael Ficarra、Kevin Gibbons が担当。

ECMAScript 2025 の新機能、Import attributes と JSON modules、Iterator helper methods、Set の集合演算メソッド、RegExp.escape()、正規表現パターン修飾子、Duplicate named capturing groups、Promise.try()、16 ビット浮動小数点数サポートなど。

出展:Ecma International approves new standards - Ecma International

#Import attributes と JSON modules

JavaScript 以外のアーティファクトをインポートするための構文基盤が追加された。最初にサポートされるのは JSON モジュール。静的インポートではwith { type: 'json' }構文を使用し、動的インポートでは第二引数にオプションオブジェクトを渡す。withの後のオブジェクトリテラル構文でインポート属性を指定する。

js
// 設定ファイルのインポート
import settings from './app-settings.json' with { type: 'json' };

// 動的にJSONを読み込み
const userPrefs = await import('./user-preferences.json', {
  with: { type: 'json' }
});

console.log(settings.theme); // "dark"
console.log(userPrefs.default.language); // "ja"

#Iterator helper methods

イテレータをより活用できるヘルパーメソッドが追加された。配列メソッドと同名のfilter()map()flatMap()some()every()find()reduce()forEach()に加え、イテレータ固有のdrop()take()toArray()が利用可能。

配列メソッドに対する改善点として、任意のイテラブルデータ構造で使用でき、中間配列を作成せずに段階的に計算する。大量データ処理において、配列メソッドが全値に対して順次メソッドを適用するのに対し、イテレータメソッドは各値に対して全メソッドを適用する。

js
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// イテレータを使った効率的な処理
const result = numbers
  .values()
  .filter((n) => n % 2 === 0) // 偶数のみ
  .drop(1) // 最初の1つをスキップ
  .take(2) // 最初の2つを取得
  .map((n) => n * 3) // 3倍にする
  .toArray(); // 配列に変換

console.log(result); // [12, 18]

#Set の集合演算メソッド

Set 同士の集合演算メソッドが追加された。intersection()(積集合)、union()(和集合)、difference()(差集合)、symmetricDifference()(対称差集合)による演算と、isSubsetOf()(部分集合判定)、isSupersetOf()(上位集合判定)、isDisjointFrom()(素集合判定)による関係チェックが可能。

js
const frontendSkills = new Set(["HTML", "CSS", "JavaScript"]);
const backendSkills = new Set(["JavaScript", "Node.js", "Python"]);

// 共通スキル(積集合)
const commonSkills = frontendSkills.intersection(backendSkills);
console.log(commonSkills); // Set { 'JavaScript' }

// 全スキル(和集合)
const allSkills = frontendSkills.union(backendSkills);
console.log(allSkills); // Set { 'HTML', 'CSS', 'JavaScript', 'Node.js', 'Python' }

// フロントエンド専用スキル(差集合)
const frontendOnly = frontendSkills.difference(backendSkills);
console.log(frontendOnly); // Set { 'HTML', 'CSS' }

#RegExp.escape()

正規表現内でテキストを安全に使用するためのエスケープ機能。特殊文字を含むテキストを正規表現パターン内で文字列として扱いたい場合に使用する。引用符で囲まれていないテキストのみを削除するような処理で活用できる。

js
const userInput = "price: $9.99 (tax included)";
const searchTerm = "$9.99";

// 特殊文字を含む文字列を安全にエスケープ
const escapedTerm = RegExp.escape(searchTerm);
const regex = new RegExp(escapedTerm, "g");

const isFound = regex.test(userInput);
console.log(isFound); // true

// 置換処理での活用
const highlighted = userInput.replace(
  new RegExp(RegExp.escape(searchTerm), "g"),
  `<mark>${searchTerm}</mark>`
);
console.log(highlighted); // "price: <mark>$9.99</mark> (tax included)"

#正規表現パターン修飾子

正規表現の一部分にのみフラグを適用できるインラインフラグ機能。正規表現全体ではなく、特定の部分にのみ大文字小文字を無視するiフラグなどを適用できる。(?i:pattern)のような構文で使用する。

js
const text = "Visit our STORE or browse the catalog";

// 特定の単語のみ大文字小文字を無視
const pattern = /visit.*(?i:store).*catalog/;
console.log(pattern.test(text)); // true

// 複数の修飾子を組み合わせ
const emailPattern = /^[a-z]+@(?i:GMAIL|YAHOO)\.com$/;
console.log(emailPattern.test("[email protected]")); // true
console.log(emailPattern.test("[email protected]")); // false(ユーザー名は小文字のみ)

// 部分的にマルチライン対応
const multiPattern = /start(?m:^middle$)end/;

#Duplicate named capturing groups

異なる選択肢内であれば同じグループ名を複数回使用できるようになった。正規表現の異なる分岐で同じ名前のキャプチャグループを定義し、マッチした分岐のグループ結果を取得できる。

js
// 日付フォーマットの解析(同じグループ名を異なる選択肢で使用)
const datePattern =
  /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})|(?<day>\d{2})\/(?<month>\d{2})\/(?<year>\d{4})/v;

const isoDate = "2025-06-27";
const usDate = "27/06/2025";

const isoMatch = datePattern.exec(isoDate);
console.log(isoMatch.groups); // { year: "2025", month: "06", day: "27" }

const usMatch = datePattern.exec(usDate);
console.log(usMatch.groups); // { year: "2025", month: "06", day: "27" }

// どちらの形式でも同じグループ名でアクセス可能
console.log(isoMatch.groups.year); // "2025"
console.log(usMatch.groups.year); // "2025"

#Promise.try()

純粋に非同期でないコードで Promise チェーンを開始できる機能。同期関数が例外を投げる可能性がある場合でも、Promise チェーン内で統一的にエラーハンドリングできる。

js
function parseUserData(jsonString) {
  // JSON.parseは同期関数だが例外を投げる可能性がある
  return Promise.try(() => {
    const data = JSON.parse(jsonString);
    return validateUser(data); // 非同期のバリデーション関数
  })
    .then((user) => {
      console.log("Valid user:", user);
      return user;
    })
    .catch((error) => {
      console.error("Parse or validation error:", error);
      return null;
    });
}

// 使用例
parseUserData('{"name": "Alice", "age": 30}').then((result) =>
  console.log(result)
);

parseUserData("invalid json").then((result) => console.log(result)); // null(エラーがキャッチされる)

#16 ビット浮動小数点数サポート

半精度浮動小数点数の処理機能が追加された。Math.f16round()メソッド、新しい型付き配列Float16ArrayDataViewgetFloat16()setFloat16()メソッドが提供される。

js
// 16ビット浮動小数点数への丸め
const originalValue = 3.141592653589793;
const float16Value = Math.f16round(originalValue);
console.log(float16Value); // 3.140625(16ビット精度に丸められる)

// Float16Arrayの使用
const float16Array = new Float16Array([1.5, 2.7, 3.9]);
console.log(float16Array); // Float16Array(3) [ 1.5, 2.69921875, 3.900390625 ]

// DataViewでの16ビット浮動小数点数操作
const buffer = new ArrayBuffer(8);
const view = new DataView(buffer);

view.setFloat16(0, 42.5);
view.setFloat16(2, -17.25);

console.log(view.getFloat16(0)); // 42.5
console.log(view.getFloat16(2)); // -17.25

// メモリ効率的なグラフィックスデータ処理に有用
const vertices = new Float16Array([0.0, 1.0, 0.5, -0.5, -0.5, -0.5]);

Chrome 138 リリース、AI API 搭載と CSS 新機能を提供

Chrome 138 が正式リリース。組み込み AI API、新しい CSS 関数、フォルダブルデバイス対応機能などが追加。

出展:

#組み込み AI、Translator API、Language Detector API、Summarizer API

Translator API、Language Detector API、Summarizer API が提供開始。これらの API は Gemini Nano を活用し、ローカルで AI 処理を実行できるため、プライバシーを保護しながら高速な処理が可能。

#Translator API

ユーザーの母国語でのコンテンツ投稿を可能にする翻訳機能。サポートチャットなどで、ユーザーの投稿をサポート担当者の言語に翻訳してからデバイスを離れるようにすることで、スムーズで包括的なエクスペリエンスを提供できる。

javascript
// 翻訳機能の利用可能性を確認
const translatorCapabilities = await Translator.availability({
  sourceLanguage: "ja",
  targetLanguage: "en",
});

if (translatorCapabilities === "available") {
  // 翻訳ツールを作成
  const translator = await Translator.create({
    sourceLanguage: "ja",
    targetLanguage: "en",
  });

  // テキストを翻訳
  const result = await translator.translate("次のバス停はどこですか?");
  console.log(result); // "Where is the next bus stop?"
}

参考:Translator API

#Language Detector API

デバイス上で言語検出を実行し、クラウドサーバーへのアップロードが不要なためプライバシーを保護。Translator API と組み合わせて使用することで、自動的に適切な翻訳を提供できる。

javascript
// 言語検出機能の利用可能性を確認
const detectorCapabilities = await LanguageDetector.availability();

if (detectorCapabilities === "available") {
  // 言語検出ツールを作成
  const detector = await LanguageDetector.create();

  // テキストの言語を検出
  const results = await detector.detect("Bonjour tout le monde");
  console.log(results[0].detectedLanguage); // "fr"
  console.log(results[0].confidence); // 0.99
}

参考:Language Detector API

#Summarizer API

記事要約、タイトル提案、長文の簡潔な要約生成などに活用。文章、段落、箇条書きなど様々な長さと形式での要約が可能。

javascript
// 要約機能の利用可能性を確認
const summarizerCapabilities = await Summarizer.availability();

if (summarizerCapabilities === "available") {
  // 要約ツールを作成
  const summarizer = await Summarizer.create({
    type: "tl;dr",
    format: "plain-text",
    length: "short",
  });

  // 長文を要約
  const article =
    "Chrome 138が正式リリースされ、多くの新機能が追加されました...";
  const summary = await summarizer.summarize(article);
  console.log(summary); // "Chrome 138が正式リリースされ、AI API、CSS関数、フォルダブルデバイス対応が追加。"
}

参考:Summarizer API

#CSS 関数 abs()、sign()、progress()、sibling-index()、sibling-count()など

符号関連のabs()sign()関数、進行状況を表すprogress()関数、兄弟要素の位置と数を取得するsibling-index()sibling-count()関数が追加。また、要素がコンテナブロックの利用可能スペースを正確に埋めるstretchキーワードがサイズ指定プロパティで利用可能になった。

#Viewport Segments API

フォルダブルデバイス(折り畳み可能な端末)対応として、Viewport Segments API が提供開始。JavaScript または CSS でビューポートの論理的に分離された領域の位置とサイズにアクセスできる。

ビューポートセグメントは、ビューポートが 1 つ以上のハードウェア機能(折り目や個別のディスプレイ間のヒンジ)によって分割された際に作成される。これにより、デュアルペインのユーザーエクスペリエンス作成や、折り目を超えたコンテンツレイアウトの回避が可能になる。

参考:Viewport Segments API で折りたたみ式デバイスをサポートする

#HTML 属性値内の<>のエスケープ

HTML 仕様の変更により、属性値内の<>がシリアライゼーション時に自動的にエスケープされるようになった。この変更は mutation XSS(mXSS)脆弱性を防ぐためのセキュリティ向上が目的。

html
<!-- 従来の動作 -->
<div data-content="<u>hello</u>"></div>

<!-- Chrome 138以降 -->
<div data-content="&lt;u&gt;hello&lt;/u&gt;"></div>

変更はinnerHTMLouterHTMLプロパティのアクセス時、getHTML()メソッドの呼び出し時など、DOM を文字列表現に変換するシリアライゼーション処理にのみ影響する。HTML の解析(パース)処理は変更されず、getAttribute()datasetなどの DOM API で取得する属性値も従来通り。

javascript
const div = document.querySelector(
  'div[data-content="&lt;u&gt;hello&lt;/u&gt;"]'
);

// これらのAPIは従来通りデコードされた値を返す
console.log(div.getAttribute("data-content")); // "<u>hello</u>"
console.log(div.dataset.content); // "<u>hello</u>"

// シリアライゼーション時はエスケープされる
console.log(div.outerHTML); // '<div data-content="&lt;u&gt;hello&lt;/u&gt;"></div>'

参考:HTML spec change: escaping < and > in attributes

Vite 7.0 リリース、Node.js 18 ドロップとブラウザターゲット変更

Vite 7.0 が正式リリース。Node.js 18 の EOL(2025 年 4 月末)に伴い、Node.js 20.19+、22.12+が必要になった。新しいバージョン範囲ではrequire(esm)がフラグなしでサポートされるため、Vite 7.0 を ESM-only で配布しながら、CJS モジュールから Vite JavaScript API を使用することが可能。

デフォルトブラウザターゲットが'modules'から'baseline-widely-available'に変更され、Chrome 87→107、Edge 88→107、Firefox 78→104、Safari 14.0→16.0 となった。Baseline Widely Available は、ブラウザ間で 30 か月以上利用可能な確立された機能を示し、将来のリリースでのデフォルトブラウザターゲットに予測可能性を追加する。

VoidZero チームが開発する Rust 製バンドラー Rolldown との統合が進行中で、rolldown-viteパッケージを使用することで特に大規模プロジェクトでのビルド時間短縮が期待できる。

実験的な Environment API に新しいbuildAppフックが追加され、プラグインが環境の構築を調整できるようになった。Cloudflare チームは Cloudflare Vite plugin 1.0 をリリースし、React Router v7 の公式サポートを発表するなど、Environment API の可能性を示している。

出展:Vite 7.0 is out!

Playwright v1.53.0 リリース、Trace Viewer と HTML レポーター機能強化

Playwright v1.53.0 が正式リリース。Trace Viewer と HTML レポーターに新しい Steps 表示機能、カスタムタイトル設定、ロケーター記述機能などが追加。

新しい Steps 表示機能により Trace Viewer と HTML レポーターでのテスト実行過程の可視化が改善。HTML レポーターではtitleオプションによりテスト実行のカスタムタイトル設定が可能になった。

javascript
import { defineConfig } from "@playwright/test";

export default defineConfig({
  reporter: [["html", { title: "Custom test run #1028" }]],
});

locator.describe()メソッドでロケーターに説明を追加でき、トレースビューアーとレポートでの可読性が向上。

javascript
const button = page.getByTestId("btn-sub").describe("Subscribe button");
await button.click();

npx playwright install --listでインストール済みブラウザの一覧表示も追加された。ブラウザバージョンは Chromium 138.0.7204.4、Mozilla Firefox 139.0、WebKit 18.5 に更新。

出展:v1.53.0

Claude Code GitHub Actions 公開

Claude Code が GitHub Actions に対応し、AI による自動 PR 作成・コード実装・バグ修正・レビューが可能に。@claudeを issue や PR コメントで呼び出すだけで、コード生成や修正、プロジェクト標準に沿った実装を自動化できる。CLAUDE.md によるプロジェクト固有ルールの反映や、API キー・許可コマンドのセキュアな管理、コスト最適化のための細かな設定も可能。AWS Bedrock や Google Vertex AI との連携にも対応。

  • @claudeコメントで PR 作成・バグ修正・実装支援などを自動化
  • CLAUDE.md でコーディング規約やレビュー基準を指定可能
  • API キーや許可コマンドは GitHub Secrets で安全に管理
  • コスト最適化やセキュリティ強化のための詳細設定に対応
  • AWS Bedrock や Google Vertex AI 経由の利用もサポート

リポジトリ:anthropics/claude-code-action

出展:GitHub Actions - Authropic

GitHub Copilot Coding Agent がパブリックプレビューで利用可能に

GitHub が Microsoft Build 2025 で GitHub Copilot Coding agent を発表。VS Code から直接アクセス可能で、GitHub Actions を活用した安全でカスタマイズ可能な開発環境を提供。GitHub Issue を Copilot に割り当てるとエージェントが作業を開始し、Draft pull request に変更を push、開発者は進捗を追跡しフィードバックを提供可能。

  • GitHub Actions によるセキュアでカスタマイズ可能な開発環境
  • Model Context Protocol(MCP)で外部データとの連携が可能
  • Branch protections と Controlled internet access でセキュリティ確保
  • Pull requests には人間の承認が必要で CI/CD 保護を強化
  • 低〜中程度の複雑さタスクに優れた性能を発揮
  • Copilot Enterprise and Copilot Pro+ユーザー向けにプレビュー提供

利用方法:

  1. 公式ドキュメントに従い Coding Agent に Repository へのアクセスを許可
  2. Issue で Copilot をアサイン

出展:GitHub Introduces Coding Agent For GitHub Copilot

GitHub Models が GitHub Actions のトークンを利用できるように

GitHub Models で、GitHub Actions のGITHUB_TOKENを使用してリクエストを認証する機能が一般利用可能に。これにより、AI 機能をアクションに直接統合し、個人用アクセストークン(PATs)の生成と管理が不要に。AI を活用した GitHub Actions の作成と共有がこれまで以上に簡単に。ワークフローに AI を組み込むことで、課題コメントの生成やプルリクエストのレビューなどを効率化。

出展:GitHub Actions token integration now generally available in GitHub Models

GitHub Actions で macOS 15 と Windows 2025 イメージの一般提供開始

GitHub Actions で macOS 15 と Windows 2025 のイメージが一般提供開始された。

出展:GitHub Actions: macOS 15 and Windows 2025 images are now generally available

Notification of upcoming breaking changes in GitHub Actions

古い GitHub Actions のキャッシュサービスが、2025 年 4 月 15 日に完全にオフになる。 また、2025 年 4 月 1 日以降、deployment 権限が変更される。 今までは deployment: read でデプロイメントのレビュー、承認、拒否が可能だったが、 2025 年 4 月 1 日以降は、deployment: write が要求される。

出展:https://github.blog/changelog/2025-03-20-notification-of-upcoming-breaking-changes-in-github-actions/

Copilot Users Can Ask About A Failed Actions Job

失敗した Actions のジョブについて、Copilot に尋ねることが出来る機能の一般提供が開始された。

https://github.blog/changelog/2025-01-15-copilot-users-can-ask-about-a-failed-actions-job-ga/

プルリクエストのステータスチェックや、アクションジョブページから利用できる。

この機能は誰でも利用出来るが、Copilot のチャットメッセージを消費する。 つまり Copilot Free の場合は、月間 50 メッセージまで利用可能だと思われる。

actions/cache v1-v2 deprecation

Github Actions のactions/cache v1-v2 が非推奨になりました。 2025 年 2 月 1 日より、Actions のキャッシュストレージは新しいアーキテクチャに移行するため、actions/cache の v1-v2 は廃止されます。

https://github.blog/changelog/2024-09-16-notice-of-upcoming-deprecations-and-changes-in-github-actions-services/

著者について

Hi there. I'm hrdtbs, a frontend expert and technical consultant. I started my career in the creative industry over 13 years ago, learning on the job as a 3DCG modeler and game engineer in the indie scene.

In 2015 I began working as a freelance web designer and engineer. I handled everything from design and development to operation and advertising, delivering comprehensive solutions for various clients.

In 2016 I joined Wemotion as CTO, where I built the engineering team from the ground up and led the development of core web and mobile applications for three years.

In 2019 I joined matsuri technologies as a Frontend Expert, and in 2020 I also began serving as a technical manager supporting streamers and content creators.

I'm so grateful to be working in this field, doing something that brings me so much joy. Thanks for stopping by.